<?xml version="1.0" encoding="UTF-8"?>
 <!DOCTYPE html PUBLIC  "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml">
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
 <meta name="keywords" content="W3C SVG 1.1 Test Suite testsuite mobile"/>
 <meta name="description" content="W3C SVG 1.1 Test Suite"/>
 <title>
SVG 1.1 test:animate-elem-52-t </title>
 <style type="text/css">
 <!--
 body { font-family: "Lucida Grande", verdana, helvetica, sans-serif; line-height: 1.3; text-align: left; margin-top: 0; margin-bottom: 0 }
 .pageTitle { line-height: 1.5; font-weight: bold; margin-bottom: 1em;}
 .pageSubTitle  { color: blue; font-size: 200%; font-weight: bold }
 .openChapter { color: blue; line-height: 1.3; font-weight: bold }
 .openSection { color: blue; line-height: 125%; font-weight: bold }
 .info { color: black; line-height: 1.2; font-size: 90%; }
 p { margin-top:0; margin-bottom:0; padding-top:0; padding-bottom:0 }
 .linkbar { text-align: center; margin: 1em 1em 0.25em 1em;}
 blockquote { margin-top:0; margin-bottom:0; padding-top:0; padding-bottom:0 }
 .opscript {margin-left: 3%; margin-right: 3%; }
 .opscript p { margin-top: 0.7em}
 .navbar {background: black; color: white; font-weight: bold}
 -->
 </style>
 </head>
 <body class="bodytext">

	<div class="linkbar"> 
<p>
<a href="full-animate-elem-52-t.html">Full version</a>, <a href="basic-animate-elem-52-t.html">Basic version</a>, <a href="tiny-animate-elem-52-t.html">Tiny version</a></p>
<p>Specification link: <a target="spec" href="http://www.w3.org/TR/SVG11/animate.html#AnimationElements">19.2 Animation elements</a></p>
 <p>
				<a href="tiny-animate-elem-46-t.html">animate-elem-46-t ←</a> 
				<a href="tiny-index.html">index</a>
				<a href="tiny-animate-elem-60-t.html">→ animate-elem-60-t</a>
						</p></div>

	<table align="center" border="0" cellspacing="0" cellpadding="10">
		<tr>
			<td align="center" colspan="3">
				<table border="0" cellpadding="8">
					<tr>
						<td align="center" colspan="2" class="pageTitle">
							<h1>animate-elem-52-t</h1>
						</td>
					</tr>
					<tr  class="navbar">
						<td align="center">
							SVG Image
						</td>
						<td align="center">
							PNG Image
						</td>
					</tr>
					<tr>
						<td align="right">
   	    		  			
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
            codebase="" id="mySVGViewerObj" width=80 height=60>
    <param name=movie value="../SvgViewer.swf">
    <param name="FlashVars" value="sourceType=url_svg&svgURL=../svggen/animate-elem-52-t.svg">
    <param name="wmode" value="transparent">
    <embed play=false name="mySVGViewerObj" 
	    src="../SvgViewer.swf" quality=high wmode="transparent"
	    width=80 height=60 type="application/x-shockwave-flash"
	    FlashVars="sourceType=url_svg&svgURL=../svggen/animate-elem-52-t.svg">
    </embed >
</object>
						</td>
						<td align="left">
							<img alt="raster image of animate-elem-52-t" src="../png/tiny-animate-elem-52-t.png" width="80" height="60"/>
						</td>
					</tr>
				</table>
			</td>
		</tr>
	</table>

               
<div class="opscript">
         <p>
            The purpose of this test is to test eventbase targets.
         </p>
         <p>
            The test consists of 4 rectangles named A, B, C, D. The D rectangle contains 
            three animations changing the color of the animation target. 
            Each animation applies to one of the other rectangles 
            by using xlink:href. Clicking on rect A should change it's 
            color immediately, clicking B changes its color after 2 seconds, 
             clicking C changes its color after 4 seconds and clicking D shows no visible change
             (although D contains the animations the event target for each 
            animation is the referenced rectangle, this rectangle is also the 
            animation target.)
         </p>
         <p>
            The following sections in the SMIL Animation spec (http://www.w3.org/TR/smil-animation/) 
            are relevant as confirmation of this test:
            The SMIL spec(3.6.7 subsection "Event Values") states that "If the 
            Eventbase-element term is missing, the event-base element is defined to 
            be the target element of the animation"
            The SMIL spec (3.1 subsection "The target element") says that the 
            animation target may be defined explicitly thru the targetElement IDREF 
            or href URI.
            So in this test, the animation target is defined through 
            xlink:href and the event base per definition is then also this 
            referenced element.
         </p>

		</div>
<div class="linkbar"> <p>
				<a href="tiny-animate-elem-46-t.html">animate-elem-46-t ←</a>
				<a href="tiny-index.html">index</a>
				<a href="tiny-animate-elem-60-t.html">→ animate-elem-60-t</a>
						</p></div>
</body>
</html>
